<html>
<head> 
	<meta name="keywords" content="jquery,user interface,ui,widgets,interaction,javascript,json,formatter,viewer,jsonviever" /> 
	<meta name="description" content="jQuery JsonViewer Simple Plugin" /> 
	<meta name="author" content="Andrey Stepantsov" /> 
	<title>jQuery JsonViewer Plugin - Demo</title> 
	<!-- support pretty markup -->
    <link href="http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.css" type="text/css" rel="stylesheet" />
    <script type="text/javascript" src="http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.js"></script>
	
	<link rel="stylesheet" href="http://jquery-ui.googlecode.com/svn/tags/latest/themes/base/jquery-ui.css" type="text/css" media="all" /> 
    <!--link rel="stylesheet" href="http://jquery-ui.googlecode.com/svn/tags/1.7.2/themes/base/jquery-ui.css" type="text/css" media="all" /--> 
    <!--link rel="stylesheet" href="http://jquery-ui.googlecode.com/svn/tags/1.8rc2/themes/base/jquery-ui.css" type="text/css" media="all" /--> 
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script> 
	<!--script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script--> 
	<script src="http://jquery-ui.googlecode.com/svn/tags/latest/ui/minified/jquery-ui.min.js" type="text/javascript"></script> 
	<script src="jquery.jsonviewer.js" type="text/javascript"></script> 
	
</head> 
<body>
<script type="text/javascript">
    $(document).ready(function() {
        prettyPrint();
        var myobj = { name: "MyObj Name", data: [1, 2, 3] };
        var test_object = {
            test_number: 1,
            test_string: "test string",
            test_string2: new String("another test string"),
            test_date: new Date(),
            test_boolean: true,
            test_array: [[1, 2, 3], [4, 5, 6]],
            test_object: { a: 1, b: "2", another: { internal_array: [{ fate: true }, 34]} }
        }
        $('#basic_usage').jsonviewer({ json_name: 'myobj', json_data: myobj });
        //$('#json_viewer').jsonviewer({ json_name: 'test', type_prefix: false, json_data: test_object });
    });
</script>    
    <p>Basic Usage:</p>
    <pre class="prettyprint lang-html">
    &lt;script type="text/javascript"&gt;
    var myobj = new {name:"MyObj Name", data:[1,2,3]};
    $(document).ready(function() {
        $('#basic_usage').jsonviewer({
            json_name: 'myobj', // specifies a display name for the JSON object
            json_data: myobj    // specifies the JSON object data
        });
    }
    &lt;/script&gt;
    &lt;div id="basic_usage" /&gt;
    </pre>
    <div id="basic_usage"></div>
    <div id="json_viewer"></div>
</body>
</html>